<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@include file="/context/mytags.jsp"%>
<div class="portlet box blue">
	<div class="portlet-title">
		<div class="caption">
			<i class="fa fa-gift"></i><span name="title">新增产品</span><span
				name="showProduct" style="display: none;">${msg }</span>
		</div>
	</div>
	<div class="portlet-body form">
		<form id="putForm" class="form-horizontal form-bordered"
			action="/product/save" method="post">
			<!-- 所属分类 -->
			<div class="form-group">
				<label class="col-md-3 control-label">所属分类:</label>
				<div class="col-md-4">
					<div class="input-icon right">
						<i class="fa"></i> <input type="hidden" name="productTypeId"
							value="${product.productTypeId }" /> <input type="text"
							class="form-control" name="productTypeName" required
							onclick="showProductType()" required placeholder="点击选择类型"
							style="cursor: pointer;" value="${product.productType.name }"
							readonly="readonly" />
					</div>
				</div>
			</div>
			<!-- 产品名称 -->
			<div class="form-group">
				<label class="col-md-3 control-label">产品名称:</label>
				<div class="col-md-4">
					<div class="input-icon right">
						<i class="fa"></i><input type="text" class="form-control"
							name="name" value="${product.name}" maxlength="45"
							required="required" />
					</div>
				</div>
			</div>
			<!-- 公司货号 -->
			<div class="form-group">
				<label class="col-md-3 control-label">公司货号:</label>
				<div class="col-md-4">
					<div class="input-icon right">
						<i class="fa"></i><input type="text" class="form-control"
							name="code" value="${product.code}" maxlength="45"
							required="required" />
					</div>
				</div>
			</div>

			<!-- 眼光1 -->
			<!-- 单位、包装、体积 -->
			<div class="form-group">
				<span class="col-md-3 control-label">单位:</span>
				<div class="col-md-4">
					<div class="input-icon right">
						<i class="fa"></i><input class="form-control" type="text"
							name="util" value="${product.util}" maxlength="45" />
					</div>
				</div>
			</div>
			<div class="form-group">
				<label class="col-md-3 control-label">包装:</label>
				<div class="col-md-4">
					<div class="input-icon right">
						<i class="fa"></i><input class="form-control" type="text"
							name="packing" value="${product.packing}" maxlength="45" />
					</div>
				</div>
			</div>
			<div class="form-group">
				<label class="col-md-3 control-label">包装体积:</label>
				<div class="col-md-4">
					<div class="input-icon right">
						<i class="fa"></i><input class="form-control" number="true"
							name="volume" value="${product.volume}" maxlength="45" />
					</div>
				</div>
			</div>
			<!-- 长、宽、高 -->
			<div class="form-group">
				<label class="col-md-3 control-label">长:</label>
				<div class="col-md-4">
					<div class="input-icon right">
						<i class="fa"></i><input class="form-control" name="length"
							value="${product.length}" number="true" maxlength="45" />
					</div>
				</div>
			</div>
			<div class="form-group">
				<label class="col-md-3 control-label">宽:</label>
				<div class="col-md-4">
					<div class="input-icon right">
						<i class="fa"></i><input class="form-control" number="true"
							name="weight" value="${product.weight}" maxlength="45" />
					</div>
				</div>
			</div>
			<div class="form-group">
				<label class="col-md-3 control-label">高:</label>
				<div class="col-md-4">
					<div class="input-icon right">
						<i class="fa"></i><input class="form-control" number="true"
							name="height" value="${product.height}" maxlength="45" />
					</div>
				</div>
			</div>
			<!-- 毛重、净重 -->
			<div class="form-group">
				<label class="col-md-3 control-label">毛重:</label>
				<div class="col-md-4">
					<div class="input-icon right">
						<i class="fa"></i><input class="form-control" number="true"
							name="grossWeight" value="${product.grossWeight}" maxlength="45" />
					</div>
				</div>
			</div>
			<div class="form-group">
				<label class="col-md-3 control-label">净重:</label>
				<div class="col-md-4">
					<div class="input-icon right">
						<i class="fa"></i><input class="form-control" number="true"
							name=netWeight value="${product.netWeight}" maxlength="45" />
					</div>
				</div>
			</div>
			<div class="form-actions">
				<div class="col-md-9 col-md-offset-3">
					<button name="saveAgain" type="button" class="btn btn-primary"
						onclick="saveAgain(this,'/product/product')">保存并新增</button>
					<button name="saveClose" type="button" class="btn btn-primary"
						onclick="save(this)">保存并关闭</button>
					<button name="toEdit" type="button" class="btn btn-primary"
						onclick="editPage(this);">编辑</button>
					<button type="reset" class="btn btn-default" onclick="cancel()">关闭</button>
				</div>
			</div>
			<input type="hidden" name="id" value="${product.id}">
		</form>
	</div>
</div>
<!-- 隐藏的树状组织 -->
<div class="modal fade" id="productTypeAreaModal" tabindex="-1"
	role="basic" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
					aria-hidden="true"></button>
				<h4 class="modal-title">所属类型</h4>
			</div>
			<div class="modal-body">
				<ul id="productTypeArea" class="ztree"
					style="margin-top: 0; width: 160px;"></ul>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn blue" onclick="makeSureType()">确定</button>
				<button type="button" class="btn default" data-dismiss="modal">关闭</button>
			</div>
		</div>
	</div>
</div>
<script type="text/javascript"
	src="<c:url value="/static/custom/datepicker-util.js"></c:url>"></script>
<script type="text/javascript"
	src="<c:url value="/static/custom/save.js"></c:url>"></script>
<script type="text/javascript">
	var form = $('.portlet-body.form form');
	$(function() {
		if ($('span[name=showProduct]').html() == "show") {
			$('span[name=title]').html("查看产品");
			$(':input').attr('readonly', ' readonly');
			$('input[name=productTypeName]').attr('disabled', 'disabled');
			$('input[name=productTypeName]').css('cursor', 'no-drop');
			$('button[name=saveAgain]').hide();
			$('button[name=saveClose]').hide();
		} else {
			$('button[name=toEdit]').hide();
			form.validate();
		}
	});

	/** 成为编辑 */
	function editPage(obj) {
		$('span[name=title]').html("编辑产品");
		$('button[name=saveAgain]').slideDown('slow');
		$('button[name=saveClose]').slideDown('slow');
		form.validate();
		$(':input').removeAttr('readonly');
		$('input[name=productTypeName]').attr('readonly', 'readonly');
		$('input[name=productTypeName]').removeAttr('disabled');
		$('input[name=productTypeName]').css('cursor', 'pointer');
		$(obj).slideUp('slow');
	}
</script>